import { receiptRecord } from '@/services/api/api-instruct-record';
import { CheckSquareOutlined, QuestionCircleOutlined } from '@ant-design/icons';
import { DrawerForm } from '@ant-design/pro-form';
import { useState } from 'react';
import ListReceipt from './ListReceipt';
import Tree from 'antd/lib/tree';
import Reminders from './Reminders';

interface ReceiptAssignProps {
  id: string;
  receipt: string;
  type: 'read' | 'receipt'
  isRun: boolean;
}

const ReceiptAssign: React.FC<ReceiptAssignProps> = ({ id, receipt, type, isRun }) => {
  const [dataTree, setDataTreeState] = useState([]);
  const [dataCheckTree, setDataCheckTreeState] = useState<any>();

  const checkTreeKeys = new Array();

  const [createdCombineId, setCreatedCombineIdState] = useState<string>();

  /**
   * 加载单位树请求网络
   */
  const loadData = async () => {
    try {
      const response = await receiptRecord({ id, type: type === 'read' ? 1 : 2 });

      if (response.code === 0) {
        setDataTreeState(readyTreeData(response.data));
        setDataCheckTreeState(checkTreeKeys);
      }
    } catch (error) { }
  };

  /**
   * 预备Tree结构数据
   * @param data
   */
  function readyTreeData(data: Array<UserData.Organization>): any {
    const treeData = new Array();

    if (data) {
      data.forEach((val, idx, array) => {
        treeData.push({
          title: val.name,
          key: val.id,
          icon: val.isView === 1 ? <CheckSquareOutlined /> : <QuestionCircleOutlined />,
          children: readyTreeData(val.children as Array<UserData.Organization>),
        });

        if (val.isView !== undefined && val.isView === 1 && !val.children) {
          checkTreeKeys.push(val.id);
        }
      });
    }
    return treeData;
  }

  return (
    <DrawerForm
      title={<div style={{ display: 'flex', justifyContent: 'space-between' }}>
        {type === 'receipt' ? <span>回执情况</span> : <span>阅读情况</span>}
        {(type === 'receipt' && isRun) && <Reminders type='receipt' id={id} isRun={isRun} />}
      </div>}
      trigger={<a>{receipt}</a>}
      drawerProps={{
        size: 'large',
        forceRender: true,
        destroyOnClose: true,
        width: '100%',
      }}
      submitter={false}
      onVisibleChange={(visible) => {
        if (visible) {
          loadData();
        }
      }}
    >
      {dataTree && dataTree.length ? (
        <>
          <Tree
            treeData={dataTree}
            checkedKeys={dataCheckTree}
            checkable
            style={{ width: '100%' }}
            defaultExpandAll={true}
            onSelect={(selectedKeys, info) => {
              console.log('==1==', info);

              if (info.selected && info.node.checked) {
                console.log('====', selectedKeys, info);
                setCreatedCombineIdState(info.node.key as string);
              }
            }}
          />
          <ListReceipt recordId={id} createdCombineId={createdCombineId} type={type === 'read' ? 1 : 2} />
        </>
      ) : (
        '暂无数据'
      )}
    </DrawerForm>
  );
};

export default ReceiptAssign;
